"use client"
import React from 'react'
import Link from "next/link";
import { usePathname } from "next/navigation";
export default function header() {
    const pathname = usePathname();
    console.log(pathname, 'pathname')
    const linkData = [
        { path: "/performance", name: "Performance" },
        { path: "/reliability", name: "Reliability" },
        { path: "/scale", name: "Scale" },
    ]
    return (
        <div className="absolute w-full z-10">
            <div className="flex justify-between container mx-auto text-white p-8 items-center">
                <Link href="/" className="text-3xl font-bold">Home</Link>
                <div className="text-xl space-x-4">
                    {
                        linkData.map((link) =>
                        (<Link key={link.path} className={pathname === link.path ?
                            "text-purple-500" : ""} href={link.path}>{link.name}</Link>))
                    }
                </div>
            </div>
        </div>
    )
}
